<template>
	<view class="app">
		<nav-bar :shadow="false" title="告警" :bgColor="'#f8f8f8'">
			<view class="u-flex icon_setUp" slot="left"></view>
			<!-- <view class="u-flex icon_setUp right" slot="right">
				<text class="u-flex-m ellipsis icon_setUp_text">等级</text>
			</view> -->
		</nav-bar>
		<!-- <mescroll-body ref="mescrollRef" @init="mescrollInit" :down="downOption" @down="downCallback" @up="upCallback"> -->
		<u-card v-for="(item, index) in dataList" :key="index">
			<view class="" slot="head">
				<view class="u-flex">
					<image src="../../static/icon/ic_marker.png" style="width: 40rpx; height: 40rpx" class="u-m-r-20" mode=""></image>
					<text class="u-font-16">{{ item.name }}</text>
				</view>
			</view>
			<view class="" slot="body">
				<view class="u-flex">
					<image src="../../static/icon/ic_level_red.png" style="width: 113rpx; height: 100rpx" class="u-m-r-20" mode=""></image>
					<view class="u-font-14">
						<view class="u-m-b-16">
							{{ item.contents }}
						</view>
						<!-- <view class="">
							
						</view> -->
					</view>
				</view>
			</view>
			<view class="" slot="foot">
				<view class="u-font-12 u-m-b-16">报警时间:{{ item.ctime }}持续{{ item.times }}小时</view>
				<view class="u-flex u-flex-b" v-if="item.confirm_ctime!=''">
					<view class="u-font-12">确认时间:{{ item.confirm_ctime }}</view>
					<view class="u-font-12">已确认</view>
				</view>
			</view>
		</u-card>
		<!-- </mescroll-body> -->
		<!-- <u-select v-model="show" :list="list" @confirm="confirm"></u-select> -->
	</view>
</template>

<script>
// import MescrollMixin from '@/components/common/mescroll-uni/mescroll-mixins.js';

export default {
	// mixins: [MescrollMixin], // 使用mixin (在main.js注册全局组件)
	data() {
		return {
			// downOption: {
			// 	auto: false //是否在初始化后,自动执行downCallback; 默认true
			// },
			show: false,
			dataList: [],
			list: [
				{
					value: '1',
					label: '1'
				}
			]
		};
	},
	onShow() {
		this.loadData();
	},
	methods: {
		/*下拉刷新的回调 */
		downCallback() {
			//联网加载数据
			console.log('下拉刷新的回调');
			setTimeout(() => {
				uni.stopPullDownRefresh();
			}, 1000);
		},
		/*上拉加载的回调: 其中page.num:当前页 从1开始, page.size:每页数据条数,默认10 */
		upCallback(page) {
			//联网加载数据
			console.log('上拉加载的回调');
			//联网失败, 结束加载
			setTimeout(() => {
				this.mescroll.endErr();
			}, 1000);
		},
		confirm(val) {
			console.log(val);
		},
		loadData(pageNo) {
			this.$http
				.post(
					'Service/get_realAlarm',
					{ exchange_ids: this.$store.state.userInfo.exchange_ids, token: this.$store.state.userInfo.token },
					{
						load: false
					}
				)
				.then((res) => {
					console.log(res);
					this.dataList = res;
				})
				.catch(() => {
					//联网失败, 结束加载
					this.mescroll.endErr();
				});
		}
	}
};
</script>

<style lang="scss">
@import '@/style/mixin.scss';
page {
	background-color: #ededed;
}
.app {
	font-family: 'PingFang SC', tahoma, arial, 'helvetica neue', 'hiragino sans gb', 'microsoft yahei', sans-serif;
}
.icon_setUp {
	width: 187rpx;
	height: 32rpx;
	/* #ifdef MP */
	padding-left: 24rpx;
	/* #endif */
	/* #ifndef MP  */
	padding-right: 24rpx;
	/* #endif  */
	font-size: $uni-font-size-base;

	.icon_setUp_text {
		padding-left: 12rpx;
		line-height: 32rpx;
	}
}
.right {
	text-align: right;
	color: #2796f2;
}
.u-font-16 {
	color: #2796f2;
}
</style>
